<div class="left-sidebar Z1">
    <div class="sidebar-holder">
        <ul class="nav  nav-list">

            <!-- sidebar to mini Sidebar toggle -->
            <li class="nav-toggle">
                <button class="btn  btn-nav-toggle text-primary"><i class="fa fa-angle-double-left toggle-left"></i> </button>
            </li>


            <li class="active"><a href="../../index.html" data-original-title="Dashboard"><i class="fa fa-home"></i><span class="hidden-minibar"> 首页 </span></a></li>
            <li><a href="top-navbar.html" data-original-title="Top Navbar"><i class="fa fa-clock-o"></i><span class="hidden-minibar"> 实时监测 </span></a></li>


            <li class="submenu">
                <a class="dropdown" href="#" data-original-title="Pages"><i class="fa fa-desktop"></i><span class="hidden-minibar">  统计分析</span>
                </a>
                <ul>
                    <li><a href="../calendar.html" data-original-title="Calendar"><i class="fa fa-calendar"></i><span> Calendar</span></a></li>
                    <li><a href="chat.html" data-original-title="Chat"><i class="fa fa-comment"></i><span> Chat</span></a></li>
                    <li><a href="profile.html" data-original-title="Profile Activity"><i class="fa fa-th"></i><span> Profile Activity</span></a></li>

                    <li><a href="gallery.html" data-original-title="Gallery"><i class="fa fa-th"></i><span> Gallery</span></a></li>
                    <li><a href="grids.html" data-original-title="Grids"><i class="fa fa-th-large"></i><span> Grids</span></a></li>

                    <li><a href="images.html" data-original-title="Images"><i class="fa fa-picture-o"></i><span> Images</span></a></li>
                    <li><a href="inbox.html" data-original-title="Inbox"><i class="fa fa-envelope"></i><span> Inbox</span></a></li>
                    <li><a href="invoice.html" data-original-title="Invoice"><i class="fa fa-credit-card"></i><span> Invoice</span></a></li>
                    <li><a href="pricing-table.html" data-original-title="Pricing Table"><i class="fa fa-money"></i><span> Pricing Table</span></a></li>
                    <li><a href="support.html" data-original-title="Support"><i class="fa fa-gears"></i><span> Support</span></a></li>

                    <li><a href="typography.html" data-original-title="Typography"><i class="fa fa-text-width"></i><span> Typography</span></a></li>
                </ul>
            </li>

            <li class="submenu">
                <a class="dropdown" href="#" data-original-title="Utility"><i class="fa fa-tint"></i><span class="hidden-minibar">  事件告警 </span></a>
                <ul>
                    <li><a href="404.html" data-original-title="404"><i class="fa fa-exclamation-circle"></i><span> 404 Error Page</span></a></li>
                    <li><a href="505.html" data-original-title="505"><i class="fa fa-exclamation-circle"></i><span> 505 Error Page</span></a></li>
                    <li><a href="faq.html" data-original-title="FAQ"><i class="fa fa-question"></i><span> FAQ</span></a></li>
                    <li><a href="screens.html" data-original-title="Lock Screen"><i class="fa fa-lock"></i><span> Lock Screen</span></a></li>
                    <li><a href="screens.html" data-original-title="LogIn"><i class="fa fa-sign-in"></i><span> Log In</span></a></li>
                    <li><a href="screens.html" data-original-title="SignUp"><i class="fa fa-smile-o"></i><span> Sign Up</span></a></li>
                    <li><a href="template.html" data-original-title="Template"><i class="fa fa-pagelines"></i><span> Template Page</span></a></li>
                </ul>
            </li>

            <li class="submenu"> <!-- Example for second level menu -->
                <a class="dropdown" href="#" data-original-title="UI Elements"><i class="fa fa-user"></i><span class="hidden-minibar">  运维管理 </span></a>
                <ul>
                    <li><a href="alerts.html" data-original-title="Alerts"><i class="fa fa-exclamation-triangle"></i><span> Alerts</span></a></li>
                    <li><a href="animations.html" data-original-title="Animations"><i class="fa fa-font"></i><span> Animations</span></a></li>
                    <li><a href="breadcrumbs-jumbotron.html" data-original-title="Breadcrumbs"><i class="fa fa-chain"></i><span> Breadcrumbs &amp; Jumbo</span></a></li>
                    <li><a href="buttons.html" data-original-title="Buttons"><i class="fa fa-sort"></i><span> Buttons </span></a></li>
                    <li><a href="carousel.html" data-original-title="carousel"><i class="fa fa-coffee"></i><span> Carousel</span></a></li>
                    <li><a href="notifications.html" data-original-title="Notifications"><i class="fa fa-bell-o"></i><span> Notifications</span></a></li>
                    <li><a href="knobs.html" data-original-title="Knobs"><i class="fa fa-dot-circle-o"></i><span> Knobs</span></a></li>
                    <li><a href="labels-badges.html" data-original-title="Labels"><i class="fa fa-phone-square"></i><span> Labels &amp; badges</span></a></li>
                    <li><a href="list-groups.html" data-original-title="List Groups"><i class="fa fa-list"></i><span> List Groups</span></a></li>
                    <li><a href="pagination.html" data-original-title="Pagination"><i class="fa fa-sort-numeric-asc"></i><span> Pagination</span></a></li>
                    <li><a href="panels.html" data-original-title="Panels"><i class="fa fa-windows"></i><span> Panels</span></a></li>
                    <li><a href="progress-bars.html" data-original-title="Progress"><i class="fa fa-ruble"></i><span> Progress Bars</span></a></li>
                    <li><a href="sliders.html" data-original-title="Sliders"><i class="fa fa-exchange"></i><span> Sliders</span></a></li>
                    <li><a href="tabs-accordians.html" data-original-title="Tabs"><i class="fa fa-check"></i><span> Tabs &amp; Accordians</span></a></li>
                    <li><a href="info-boxes.html" data-original-title="Info Boxes"><i class="fa fa-bullseye"></i><span> Info Boxes</span></a></li>
                    <li><a href="tooltips-popovers.html" data-original-title="Tooltips"><i class="fa fa-asterisk"></i><span> Tooltips &amp; popovers</span></a></li>
                    <li><a href="wells.html" data-original-title="Wells"><i class="fa fa-beer"></i><span> Wells</span></a></li>
                    <li><a href="draggable-portlets.html" data-original-title="draggable-portlets"><i class="fa fa-windows"></i><span> Draggable Portlets</span></a></li>
                    <li><a href="bootbox-modals.html" data-original-title="bootbox-modals"><i class="fa fa-windows"></i><span> bootbox-modals</span></a></li>
                    <li><a href="extended-modals.html" data-original-title="extended-modals"><i class="fa fa-windows"></i><span> extended-modals</span></a></li>
                    <li><a href="date-paginator.html" data-original-title="date-paginator"><i class="fa fa-windows"></i><span> date-paginator</span></a></li>
                    <li><a href="file-manager.html" data-original-title="file-manager"><i class="fa fa-windows"></i><span> file-manager</span></a></li>
                    <li><a href="nestable.html" data-original-title="nestable"><i class="fa fa-windows"></i><span> nestable</span></a></li>
                    <li><a href="image-crop.html" data-original-title="image-crop"><i class="fa fa-windows"></i><span> image-crop</span></a></li>
                    <li><a href="rtl.html" data-original-title="RTL"><i class="fa fa-windows"></i><span> RTL</span></a></li>
                </ul>
            </li>

            <li class="submenu"> <!-- Example for second level menu -->
                <a class="dropdown" href="#" data-original-title="Tables"><i class="fa fa-table"></i><span class="hidden-minibar">  系统设置 </span></a>
                <ul>
                    <li><a href="basic-tables.html" data-original-title="Basic"><i class="fa fa-table"></i><span>  Basic Tables</span></a></li>
                    <li><a href="editable-tables.html" data-original-title="Editable"><i class="fa fa-table"></i><span>  Editable Tables</span></a></li>
                    <li><a href="dynamic-tables.html" data-original-title="Dynamic"><i class="fa fa-table"></i><span>  Dynamic Tables</span></a></li>
                </ul>
            </li>

            <li class=""><a href="logout.html" data-original-title="Dashboard"><i class="fa fa-dashboard"></i><span class="hidden-minibar"> 退出 </span></a></li>

        </ul>
    </div>
</div>




<script type="text/javascript">
    LAM.run(function(){
        'use strict';
        var System=this;

        var side=function(){
            $('ul.nav-list').accordion();

            $('li.nav-toggle > button').on('click',function(e){
                e.preventDefault();
                $('.hidden-minibar').toggleClass("hide");
                $('.site-holder').toggleClass("mini-sidebar");
                if($('.toggle-left').hasClass('fa-angle-double-left')){ $('.toggle-left').removeClass('fa-angle-double-left').addClass('fa-angle-double-right'); }
                else { $('.toggle-left').removeClass('fa-angle-double-right').addClass('fa-angle-double-left'); }


                if($('.site-holder').hasClass('mini-sidebar'))
                {
                    $('.sidebar-holder').tooltip({
                        selector: "a",
                        container: "body",
                        placement: "right"
                    });
                    $('li.submenu ul').tooltip('destroy');
                }
                else
                {
                    $('.sidebar-holder').tooltip('destroy');
                }


            });


            $('.nav-list a').on('click',function(){
                $('.nav-list li').removeClass('active');
                if('iframe' === $(this).attr('target')){
                    $(this).parent().addClass('active');

                }
            });
        };


        $(function(){
            side();

        });





    });




</script>